
<!doctype html>
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><html lang="en" class="no-js"> <![endif]-->
<html lang="en">
<head>
	
	<!-- Basic -->
	<title>Margo | Latest Projects</title>
	
	<!-- Define Charset -->
	<meta charset="utf-8">
	
	<!-- Responsive Metatag -->
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	
	<!-- Page Description and Author -->
	<meta name="description" content="Margo - Responsive HTML5 Template">
	<meta name="author" content="iThemesLab">
	
	
	<!-- Bootstrap CSS  -->
	<link rel="stylesheet" href="asset/css/bootstrap.min.css" type="text/css" media="screen">

	<!-- Font Awesome CSS -->
	<link rel="stylesheet" href="css/font-awesome.min.css" type="text/css" media="screen">
	
	<!-- Margo CSS Styles  -->
	<link rel="stylesheet" type="text/css" href="css/style.css" media="screen">
	
	<!-- Responsive CSS Styles  -->
	<link rel="stylesheet" type="text/css" href="css/responsive.css" media="screen">
	
	<!-- Color CSS Styles  -->
	<link rel="stylesheet" type="text/css" href="css/colors/red.css" title="red" media="screen" />
	<link rel="stylesheet" type="text/css" href="css/colors/jade.css" title="jade" media="screen" />
	<link rel="stylesheet" type="text/css" href="css/colors/blue.css" title="blue" media="screen" />
	<link rel="stylesheet" type="text/css" href="css/colors/beige.css" title="beige" media="screen" />
	<link rel="stylesheet" type="text/css" href="css/colors/cyan.css" title="cyan" media="screen" />
	<link rel="stylesheet" type="text/css" href="css/colors/green.css" title="green" media="screen" />
	<link rel="stylesheet" type="text/css" href="css/colors/orange.css" title="orange" media="screen" />
	<link rel="stylesheet" type="text/css" href="css/colors/peach.css" title="peach" media="screen" />
	<link rel="stylesheet" type="text/css" href="css/colors/pink.css" title="pink" media="screen" />
	<link rel="stylesheet" type="text/css" href="css/colors/purple.css" title="purple" media="screen" />
	<link rel="stylesheet" type="text/css" href="css/colors/sky-blue.css" title="sky-blue" media="screen" />
	<link rel="stylesheet" type="text/css" href="css/colors/yellow.css" title="yellow" media="screen" />
	
	
	
	<!-- Margo JS  -->
    <script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
	<script type="text/javascript" src="js/jquery.migrate.js"></script>
	<script type="text/javascript" src="js/modernizrr.js"></script>
	<script type="text/javascript" src="asset/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="js/jquery.fitvids.js"></script>
	<script type="text/javascript" src="js/owl.carousel.min.js"></script>
	<script type="text/javascript" src="js/nivo-lightbox.min.js"></script>
	<script type="text/javascript" src="js/jquery.isotope.min.js"></script>
	<script type="text/javascript" src="js/jquery.appear.js"></script>
	<script type="text/javascript" src="js/count-to.js"></script>
	<script type="text/javascript" src="js/jquery.textillate.js"></script>
	<script type="text/javascript" src="js/jquery.lettering.js"></script>
	<script type="text/javascript" src="js/jquery.easypiechart.min.js"></script>
	<script type="text/javascript" src="js/jquery.nicescroll.min.js"></script>
	<script type="text/javascript" src="js/jquery.parallax.js"></script>
	<script type="text/javascript" src="js/script.js"></script>
	
	<!--[if IE 8]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
	<!--[if lt IE 9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
	
</head>
<body>

	<!-- Container -->
	<div id="container">
		
		<!-- Start Header -->
		<div class="hidden-header"></div>
		<header class="clearfix">
			
			<!-- Start Top Bar -->
			<div class="top-bar">
				<div class="container">
					<div class="row">
						<div class="col-md-6">
							<!-- Start Contact Info -->
							<ul class="contact-details">
                                <li><a href="#"><i class="fa fa-map-marker"></i> House-54/A, London, UK</a>
                                </li>
                                <li><a href="#"><i class="fa fa-envelope-o"></i> info@yourcompany.com</a>
                                </li>
                                <li><a href="#"><i class="fa fa-phone"></i> +12 345 678 000</a>
                                </li>
                            </ul>
							<!-- End Contact Info -->
						</div>
						<div class="col-md-6">
							<!-- Start Social Links -->
							<ul class="social-list">
								<li>
									<a class="facebook itl-tooltip" data-placement="bottom" title="Facebook" href="#"><i class="fa fa-facebook"></i></a>
								</li>
								<li>
									<a class="twitter itl-tooltip" data-placement="bottom" title="Twitter" href="#"><i class="fa fa-twitter"></i></a>
								</li>
								<li>
									<a class="google itl-tooltip" data-placement="bottom" title="Google Plus" href="#"><i class="fa fa-google-plus"></i></a>
								</li>
								<li>
									<a class="dribbble itl-tooltip" data-placement="bottom" title="Dribble" href="#"><i class="fa fa-dribbble"></i></a>
								</li>
								<li>
									<a class="linkdin itl-tooltip" data-placement="bottom" title="Linkedin" href="#"><i class="fa fa-linkedin"></i></a>
								</li>
								<li>
									<a class="flickr itl-tooltip" data-placement="bottom" title="Flickr" href="#"><i class="fa fa-flickr"></i></a>
								</li>
								<li>
									<a class="tumblr itl-tooltip" data-placement="bottom" title="Tumblr" href="#"><i class="fa fa-tumblr"></i></a>
								</li>
								<li>
									<a class="instgram itl-tooltip" data-placement="bottom" title="Instagram" href="#"><i class="fa fa-instagram"></i></a>
								</li>
								<li>
									<a class="vimeo itl-tooltip" data-placement="bottom" title="vimeo" href="#"><i class="fa fa-vimeo-square"></i></a>
								</li>
								<li>
									<a class="skype itl-tooltip" data-placement="bottom" title="Skype" href="#"><i class="fa fa-skype"></i></a>
								</li>
							</ul>
							<!-- End Social Links -->
						</div>
					</div>
				</div>
			</div>
			<!-- End Top Bar -->
			
			<!-- Start Header ( Logo & Naviagtion ) -->
			<div class="navbar navbar-default navbar-top">
				<div class="container">
					<div class="navbar-header">
						<!-- Stat Toggle Nav Link For Mobiles -->
						<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
							<i class="fa fa-bars"></i>
						</button>
						<!-- End Toggle Nav Link For Mobiles -->
						<a class="navbar-brand" href="index.html"><img alt="" src="images/margo.png"></a>
					</div>
					<div class="navbar-collapse collapse">
						<!-- Stat Search -->
						<div class="search-side">
							<a href="#" class="show-search"><i class="fa fa-search"></i></a>
							<div class="search-form">
								<form autocomplete="off" role="search" method="get" class="searchform" action="#">
									<input type="text" value="" name="s" id="s" placeholder="Search the site...">
								</form>
							</div>
						</div>
						<!-- End Search -->
						<!-- Start Navigation List -->
						<ul class="nav navbar-nav navbar-right">
							<li>
								<a href="index.html">Home</a>
								<ul class="dropdown">
									<li><a href="index.html">Home Main Version</a></li>
									<li><a href="index-01.html">Home Version 1</a></li>
									<li><a href="index-02.html">Home Version 2</a></li>
									<li><a href="index-03.html">Home Version 3</a></li>
									<li><a href="index-04.html">Home Version 4</a></li>
									<li><a href="index-05.html">Home Version 5</a></li>
									<li><a href="index-06.html">Home Version 6</a></li>
									<li><a href="index-07.html">Home Version 7</a></li>
								</ul>
							</li>
							<li>
								<a href="about.html">Pages</a>
								<ul class="dropdown">
									<li><a href="about.html">About</a></li>
									<li><a href="services.html">Services</a></li>
									<li><a href="right-sidebar.html">Right Sidebar</a></li>
									<li><a href="left-sidebar.html">Left Sidebar</a></li>
									<li><a href="404.html">404 Page</a></li>
								</ul>
							</li>
							<li>
								<a class="active" href="#">Shortcodes</a>
								<ul class="dropdown">
									<li><a href="tabs.html">Tabs</a></li>
									<li><a href="buttons.html">Buttons</a></li>
									<li><a href="action-box.html">Action Box</a></li>
									<li><a href="testimonials.html">Testimonials</a></li>
									<li><a href="latest-posts.html">Latest Posts</a></li>
									<li><a class="active" href="latest-projects.html">Latest Projects</a></li>
									<li><a href="pricing.html">Pricing Tables</a></li>
									<li><a href="accordion-toggles.html">Accordion & Toggles</a></li>
								</ul>
							</li>
							<li>
								<a href="portfolio-3.html">Portfolio</a>
								<ul class="dropdown">
									<li><a href="portfolio-2.html">2 Columns</a></li>
									<li><a href="portfolio-3.html">3 Columns</a></li>
									<li><a href="portfolio-4.html">4 Columns</a></li>
									<li><a href="single-project.html">Single Project</a></li>
								</ul>
							</li>
							<li>
								<a href="blog.html">Blog</a>
								<ul class="dropdown">
									<li><a href="blog.html">Blog - right Sidebar</a></li>
									<li><a href="blog-left-sidebar.html">Blog - Left Sidebar</a></li>
									<li><a href="single-post.html">Blog Single Post</a></li>
								</ul>
							</li>
							<li><a href="contact.html">Contact</a></li>
						</ul>
						<!-- End Navigation List -->
					</div>
				</div>
			</div>
			<!-- End Header ( Logo & Naviagtion ) -->
			
		</header>
		<!-- End Header -->
		
		
		
		
		<!-- Start Page Banner -->
		<div class="page-banner no-subtitle">
			<div class="container">
				<div class="row">
					<div class="col-md-6">
						<h2>Latest Projects</h2>
					</div>
					<div class="col-md-6">
						<ul class="breadcrumbs">
							<li><a href="#">Home</a></li>
							<li>Latest Projects</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
		<!-- End Page Banner -->
		
		
		
		
		<!-- Start Content -->
		<div id="content">
			<div class="container">
				<div class="page-content">
					
					
					<!--Start Recent Projects-->
					<div class="recent-projects">
						<h4 class="title"><span>Latest Projects</span></h4>
						<div class="projects-carousel touch-carousel">
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<!-- Start Project Thumb -->
									<div class="portfolio-thumb">
										<a class="lightbox" data-lightbox-type="ajax" href="https://vimeo.com/78468485">
											<div class="thumb-overlay"><i class="fa fa-play"></i></div>
											<img alt="" src="images/portfolio/1.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Website</span>
											<span>Drawing</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>5</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<!-- Start Project Thumb -->
									<div class="portfolio-thumb">
										<a class="lightbox" title="This is an image title" href="images/portfolio-big-01.jpg">
											<div class="thumb-overlay"><i class="fa fa-arrows-alt"></i></div>
											<img alt="" src="images/portfolio/2.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Logo</span>
											<span>Animation</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>2</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<div class="portfolio-thumb">
										<a href="#">
											<div class="thumb-overlay"><i class="fa fa-link"></i></div>
											<img alt="" src="images/portfolio/3.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Drawing</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>8</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<!-- Start Project Thumb -->
									<div class="portfolio-thumb">
										<a href="#">
											<div class="thumb-overlay"><i class="fa fa-link"></i></div>
											<img alt="" src="images/portfolio/4.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Website</span>
											<span>Ilustration</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>12</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<!-- Start Project Thumb -->
									<div class="portfolio-thumb">
										<a class="lightbox" title="This is an image title" href="images/portfolio-big-02.jpg">
											<div class="thumb-overlay"><i class="fa fa-link"></i></div>
											<img alt="" src="images/portfolio/5.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Logo</span>
											<span>Drawing</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>5</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<!-- Start Project Thumb -->
									<div class="portfolio-thumb">
										<a href="#">
											<div class="thumb-overlay"><i class="fa fa-link"></i></div>
											<img alt="" src="images/portfolio/6.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Animation</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>9</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<!-- Start Project Thumb -->
									<div class="portfolio-thumb">
										<a class="lightbox" title="This is an image title" href="images/portfolio-big-03.jpg">
											<div class="thumb-overlay"><i class="fa fa-link"></i></div>
											<img alt="" src="images/portfolio/7.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Website</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>1</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<!-- Start Project Thumb -->
									<div class="portfolio-thumb">
										<a href="#">
											<div class="thumb-overlay"><i class="fa fa-link"></i></div>
											<img alt="" src="images/portfolio/8.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Ilustration</span>
											<span>Animation</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>6</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
						</div>
					</div>
					<!--End Recent Projects-->
					
					<!-- Divider -->
					<div class="hr5" style="margin-top:45px; margin-bottom:35px;"></div>
					
					<!--Start Recent Projects-->
					<div class="recent-projects">
						<div class="projects-carousel touch-carousel navigation-3">
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<!-- Start Project Thumb -->
									<div class="portfolio-thumb">
										<a class="lightbox" data-lightbox-type="ajax" href="https://vimeo.com/78468485">
											<div class="thumb-overlay"><i class="fa fa-play"></i></div>
											<img alt="" src="images/portfolio/1.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Website</span>
											<span>Drawing</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>5</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<!-- Start Project Thumb -->
									<div class="portfolio-thumb">
										<a class="lightbox" title="This is an image title" href="images/portfolio-big-01.jpg">
											<div class="thumb-overlay"><i class="fa fa-link"></i></div>
											<img alt="" src="images/portfolio/2.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Logo</span>
											<span>Animation</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>2</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<div class="portfolio-thumb">
										<a href="#">
											<div class="thumb-overlay"><i class="fa fa-link"></i></div>
											<img alt="" src="images/portfolio/3.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Drawing</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>8</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<!-- Start Project Thumb -->
									<div class="portfolio-thumb">
										<a href="#">
											<div class="thumb-overlay"><i class="fa fa-link"></i></div>
											<img alt="" src="images/portfolio/4.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Website</span>
											<span>Ilustration</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>12</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<!-- Start Project Thumb -->
									<div class="portfolio-thumb">
										<a class="lightbox" title="This is an image title" href="images/portfolio-big-02.jpg">
											<div class="thumb-overlay"><i class="fa fa-link"></i></div>
											<img alt="" src="images/portfolio/5.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Logo</span>
											<span>Drawing</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>5</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<!-- Start Project Thumb -->
									<div class="portfolio-thumb">
										<a href="#">
											<div class="thumb-overlay"><i class="fa fa-link"></i></div>
											<img alt="" src="images/portfolio/6.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Animation</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>9</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<!-- Start Project Thumb -->
									<div class="portfolio-thumb">
										<a class="lightbox" title="This is an image title" href="images/portfolio-big-03.jpg">
											<div class="thumb-overlay"><i class="fa fa-link"></i></div>
											<img alt="" src="images/portfolio/7.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Website</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>1</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
							<!-- Start Project Item -->
							<div class="portfolio-item item">
								<div class="portfolio-border">
									<!-- Start Project Thumb -->
									<div class="portfolio-thumb">
										<a href="#">
											<div class="thumb-overlay"><i class="fa fa-link"></i></div>
											<img alt="" src="images/portfolio/8.png" />
										</a>
									</div>
									<!-- End Project Thumb -->
									<!-- Start Project Details -->
									<div class="portfolio-details">
										<a href="#">
											<h4>Lorem Ipsum Dolor</h4>
											<span>Ilustration</span>
											<span>Animation</span>
										</a>
										<a href="#" class="like-link"><i class="fa fa-heart"></i><span>6</span></a>
									</div>
									<!-- End Project Details -->
								</div>
							</div>
							<!-- End Project Item -->
							
						</div>
					</div>
					<!--End Recent Projects-->
					
					
				</div>
			</div>
		</div>
		<!-- End Content -->
		
		
		
		
		<!-- Start Footer -->
		<footer>
			<div class="container">
				<div class="row footer-widgets">
					
					<!-- Start Subscribe & Social Links Widget -->
                    <div class="col-md-3">
                        <div class="footer-widget mail-subscribe-widget">
                            <h4>Get in touch<span class="head-line"></span></h4>
                            <p>Join our mailing list to stay up to date and get notices about our new releases!</p>
                            <form class="subscribe">
                                <input type="text" placeholder="mail@example.com">
                                <input type="submit" class="main-button" value="Send">
                            </form>
                        </div>
                        <div class="footer-widget social-widget">
                            <h4>Follow Us<span class="head-line"></span></h4>
                            <ul class="social-icons">
                                <li>
                                    <a class="facebook" href="#"><i class="fa fa-facebook"></i></a>
                                </li>
                                <li>
                                    <a class="twitter" href="#"><i class="fa fa-twitter"></i></a>
                                </li>
                                <li>
                                    <a class="google" href="#"><i class="fa fa-google-plus"></i></a>
                                </li>
                                <li>
                                    <a class="dribbble" href="#"><i class="fa fa-dribbble"></i></a>
                                </li>
                                <li>
                                    <a class="linkdin" href="#"><i class="fa fa-linkedin"></i></a>
                                </li>
                                <li>
                                    <a class="flickr" href="#"><i class="fa fa-flickr"></i></a>
                                </li>
                                <li>
                                    <a class="tumblr" href="#"><i class="fa fa-tumblr"></i></a>
                                </li>
                                <li>
                                    <a class="instgram" href="#"><i class="fa fa-instagram"></i></a>
                                </li>
                                <li>
                                    <a class="vimeo" href="#"><i class="fa fa-vimeo-square"></i></a>
                                </li>
                                <li>
                                    <a class="skype" href="#"><i class="fa fa-skype"></i></a>
                                </li>
                            </ul>
                        </div>
                    </div><!-- .col-md-3 -->
                    <!-- End Subscribe & Social Links Widget -->
                    
                    
                    <!-- Start Twitter Widget -->
                    <div class="col-md-3">
                        <div class="footer-widget twitter-widget">
                            <h4>Twitter Feed<span class="head-line"></span></h4>
                            <ul>
                                <li>
                                    <p><a href="#">@ithemeslab </a> Lorem ipsum dolor et, consectetur adipiscing eli.</p>
                                    <span>28 February 2014</span>
                                </li>
                                <li>
                                    <p><a href="#">@ithemeslab </a> Lorem ipsum dolor et, consectetur adipiscing eli.An Fusce eleifend aliquet nis application.</p>
                                    <span>26 February 2014</span>
                                </li>
                                <li>
                                    <p><a href="#">@ithemeslab </a> Lorem ipsum dolor et, consectetur adipiscing eli.</p>
                                    <span>28 February 2014</span>
                                </li>
                            </ul>
                        </div>
                    </div><!-- .col-md-3 -->
                    <!-- End Twitter Widget -->


                    <!-- Start Flickr Widget -->
                    <div class="col-md-3">
                        <div class="footer-widget flickr-widget">
                            <h4>Flicker Feed<span class="head-line"></span></h4>
                            <ul class="flickr-list">
                                <li>
                                    <a href="images/flickr-01.jpg" class="lightbox">
                                        <img alt="" src="images/flickr-01.jpg">
                                    </a>
                                </li>
                                <li>
                                    <a href="images/flickr-02.jpg" class="lightbox">
                                        <img alt="" src="images/flickr-02.jpg">
                                    </a>
                                </li>
                                <li>
                                    <a href="images/flickr-03.jpg" class="lightbox">
                                        <img alt="" src="images/flickr-03.jpg">
                                    </a>
                                </li>
                                <li>
                                    <a href="images/flickr-04.jpg" class="lightbox">
                                        <img alt="" src="images/flickr-04.jpg">
                                    </a>
                                </li>
                                <li>
                                    <a href="images/flickr-05.jpg" class="lightbox">
                                        <img alt="" src="images/flickr-05.jpg">
                                    </a>
                                </li>
                                <li>
                                    <a href="images/flickr-06.jpg" class="lightbox">
                                        <img alt="" src="images/flickr-06.jpg">
                                    </a>
                                </li>
                                <li>
                                    <a href="images/flickr-07.jpg" class="lightbox">
                                        <img alt="" src="images/flickr-07.jpg">
                                    </a>
                                </li>
                                <li>
                                    <a href="images/flickr-08.jpg" class="lightbox">
                                        <img alt="" src="images/flickr-08.jpg">
                                    </a>
                                </li>
                                <li>
                                    <a href="images/flickr-09.jpg" class="lightbox">
                                        <img alt="" src="images/flickr-09.jpg">
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div><!-- .col-md-3 -->
                    <!-- End Flickr Widget -->

                    
                    <!-- Start Contact Widget -->
                    <div class="col-md-3">
                        <div class="footer-widget contact-widget">
                            <h4><img src="images/footer-margo.png" class="img-responsive" alt="Footer Logo" /></h4>
                            <p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident</p>
                            <ul>
                                <li><span>Phone Number:</span> +01 234 567 890</li>
                                <li><span>Email:</span> company@company.com</li>
                                <li><span>Website:</span> www.yourdomain.com</li>
                            </ul>
                        </div>
                    </div><!-- .col-md-3 -->
                    <!-- End Contact Widget -->

				
				</div><!-- .row -->
				
				<!-- Start Copyright -->
				<div class="copyright-section">
					<div class="row">
						<div class="col-md-6">
							<p>&copy; 2014 Margo -  All Rights Reserved</p>
						</div>
						<div class="col-md-6">
							<ul class="footer-nav">
								<li><a href="#">Sitemap</a></li>
								<li><a href="#">Privacy Policy</a></li>
								<li><a href="#">Contact</a></li>
							</ul>
						</div>						
					</div>
				</div>
				<!-- End Copyright -->
				
			</div>
		</footer>
		<!-- End Footer -->
		
	</div>
	<!-- End Container -->
	
	<!-- Go To Top Link -->
	<a href="#" class="back-to-top"><i class="fa fa-angle-up"></i></a>
	
	<div id="loader">
		<div class="spinner">
			<div class="dot1"></div>
			<div class="dot2"></div>
		</div>
	</div>
	
	
	
</body>
</html>